﻿@{
    Layout = "~/Views/Shared/_AdminLayout.cshtml";
}
<!-- demo root element -->
<div id="app" class="box box-primary">
    <div class="box-header with-border">
        <h2>修改密码</h2>
    </div>
    <!-- /.box-header -->
    <!-- form start -->
    @*<form v-on:submit.prevent="onSubmit">
            <div class="box-body">
                <v-form v-bind:valid.sync="valid">
                    <div class="row">
                        <div class="col-sm-4 col-xs-4">
                            <v-input type="password" label="原密码：" v-bind:value.sync="model.oldPassword" help="密码必须6~30位之间" minlength="5" maxlength="30" placeholder="原密码" required icon></v-input>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group col-sm-4 col-xs-4">
                            <v-input type="text" label="新密码：" v-bind:value.sync="model.newPassword" help="密码必须6~30位之间" minlength="5" maxlength="30" placeholder="新密码" required icon></v-input>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group col-sm-4 col-xs-4">
                            <v-input type="text" label="确认密码：" v-bind:value.sync="model.newPassword2" help="密码必须6~30位之间" v-bind:match="model.newPassword" minlength="5" maxlength="30" placeholder="确认密码" required icon></v-input>
                        </div>
                    </div>
                </v-form>
            </div>
            <div class="box-footer">
                <div class="row">
                    <div class="col-sm-4 col-xs-4">
                        <button type="submit" class="btn btn-warning btn-flat" v-bind:disabled="!valid">保 存</button>
                        <a class="btn btn-default btn-flat" href="/Home/DashBoard" target="_parent">取 消</a>
                    </div>
                </div>
            </div>
        </form>*@

    <div style="max-width:500px;padding:10px 0px 10px 0px;">

        <el-form ref="form" v-bind:model="model" v-bind:rules="formRules" label-width="80px">
            <el-form-item label="原密码" prop="oldPassword">
                <el-input v-model="model.oldPassword" placeholder="原密码" clearable></el-input>
            </el-form-item>
            <el-form-item label="新密码" prop="newPassword">
                <el-input v-model="model.newPassword" placeholder="新密码" clearable></el-input>
            </el-form-item>
            <el-form-item label="确认密码" prop="newPassword2">
                <el-input v-model="model.newPassword2" placeholder="确认密码" clearable></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" v-on:click="onSubmit" v-bind:disabled="lock">保存</el-button>
                @*<el-button v-on:click="window.top.location='/Home/DashBoard'" v-bind:disabled="lock">取消</el-button>*@
            </el-form-item>
        </el-form>

    </div>

</div>
@section scripts{
    <script>


        $("doucument").ready(function () {
            var demo = new Vue({
                el: '#app',
                data: function () {
                    var $this = this;
                    function passwordValidator(rule, value, callback) {
                        if (value != $this.model.newPassword)
                            callback(new Error('两次输入密码不一致！'));
                        else
                            callback();
                    }

                    return {
                        lock: false,
                        model: {
                            oldPassword: '',
                            newPassword: '',
                            newPassword2: '',
                        },
                        formRules: {
                            oldPassword: [
                                { required: true, message: "请输入原密码。", trigger: "blur" }
                            ],
                            newPassword: [
                                { required: true, message: "请输入新密码。", trigger: "blur" }
                            ],
                            newPassword2: [
                                { required: true, message: "请输入确认密码。", trigger: "blur" },
                                { validator: passwordValidator, trigger: "blur" }
                            ]
                        }
                    }
                },
                methods: {
                    onSubmit: function () {
                        var $this = this;
                        this.lock = true;
                        this.$refs.form.validate(function (valid) {
                            if (!valid) return false;
                            $.post("/Account/ChangePassword", $this.model, function (result) {
                                if (result.success) {
                                    $this.$message.success({
                                        message: "保存成功！",
                                        onClose: function () {
                                            parent.location = "/Account/Login";
                                        }
                                    });
                                } else {
                                    $this.$message.error(result.error);
                                }
                            }, "json");
                        });
                        this.lock = false;
                    }
                }
            });

        });



    </script>
}









